<template>
    <div>
        <div class="menu-toolbar">
            <el-button type="text" icon="el-icon-plus" @click="add">添加目录</el-button>
            <el-dropdown>
              <span class="el-dropdown-link">
                导入<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown" size="small">
                <el-dropdown-item>从 POSTMAN</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
            <!-- <el-input
              placeholder="请输入内容"
              prefix-icon="el-icon-search"
              style="width: 120px;">
            </el-input> -->
        </div>
        <el-menu
        style="height:820px;"
        :default-openeds="direcotries.openeds">
            <NavMenu :data="direcotries.array"></NavMenu>
        </el-menu>
    </div>
</template>

<style scoped>
 .el-menu {
      overflow-x: hidden;
      border: none !important;
  }

  .el-submenu .el-menu-item {
      padding: 0px;
  }

  .el-menu-item {
      padding: 0px 7px 0px 19px !important;
  }

  .el-submenu__icon-arrow {
      display: none;
  }

  .menu-toolbar{
      padding-left: 5px;
  }
</style>

<script>
import NavMenu from '../components/NavMenu'
import { read } from '../api/directory'
import { EventBus } from "@/utils/event-bus";

export default {
    data() {
        return {
            workspace: this.$store.state.app.workspace,
            direcotries: this.$store.state.app.directory,
            isLoading: false
        }
    },
    components: {
        NavMenu
    },
    created() {
      EventBus.$on("refresh", () => {
        this.read()
      });
    },
    mounted() {
        // if(this.timer){
        //   clearInterval(this.timer)
        // } else {
        //   this.timer = setInterval(() => {
        //     //console.log('----------')
        //     let isEdit = this.$store.state.app.directory.isEdit
        //     // 菜单正在编辑的时候不能刷新
        //     if(!isEdit){
        //         console.log('rrrrrrrrrrrrrrrr')
        //       this.read()
        //     }
        //   }, 10000);
        // }
    },
    beforeDestroy(){
        clearInterval(this.timer)
    },
    watch: {
        workspace: {
            handler(newValue, oldValue) {
                this.read()
            },
            deep: true
        }
    },
    methods: {
        read() {
          let that = this
          let id = this.workspace.current.id
          read(id).then(response => {
            that.$store.commit('app/setDirectory', response.data)
          })
        },
        add(){
          let parent = this.workspace.current
          this.$store.commit('app/expanded', parent.id)
          this.$store.commit('app/addDirectory', parent)
        },
        test() {
          EventBus.$on("incremented", ({num,deg}) => {
                this.fontCount += num
                this.$nextTick(()=>{
                    this.backCount += num
                    this.degValue += deg;
                })
            });
        }
    }
}
</script>
